<template>
  <div class="salary-wrap">
    <div class="bg-box">
      <div class="money-box">
        <span class="title">账户余额（元）</span>
        <span class="money">{{balance}}</span>
      </div>

      <button class="deposit-box" type="button" @click="queryBank">提现</button>
    </div>

    <div class="item-box">
      <div class="content-box" @click="drawSalary">
        <span class="title">工资领取</span>
        <div class="draw-box">
          <span class="draw" v-if="month">待领取</span>
          <img src="../../../images/in.png" class="back" onclick="return false"/>
        </div>
      </div>

      <div class="content-box" v-for="(item,index) in itemList" :key="index" @click="toPage(item.path)">
        <span class="title">{{item.name}}</span>
        <img src="../../../images/in.png" class="pic" onclick="return false"/>
      </div>
    </div>


    <v-dialog v-model="sendVal" :content="content" cancelText="取消" confirmText="去绑定" @confirm="bindPage"
              @cancel="cancel"></v-dialog>
  </div>
</template>

<script>
  import {baseUrl} from "../../../common/js/env"
  import {toDecimal} from "../../../common/js/util"
  import dialog from '../../../components/dialog/dialog'

  export default {
    data() {
      return {
        itemList: [
          {
            name: "账单明细",
            path: "/bill"
          },
          {
            name: "工资卡管理",
            path: "/paycard_manage"
          }
        ],
        balance: "",
        userSign: "",
        sendVal: false,
        content: "",
        month: ""
      }
    },
    mounted() {
      let base64 = require('js-base64').Base64;
      this.userSign = base64.decode(sessionStorage.getItem("user_sign"));
      this.queryMaterial();
      this.querySalary();
    },
    methods: {
      drawSalary() {//领取工资
        this.axios.get(baseUrl + "/billrecord/query_bankcardwithDraw?sgin=" + this.userSign).then((res) => {
          let resultObj = res.data;
          if (resultObj.code == 0 && resultObj.data != null) {
            if (resultObj.data.type == 1) { //没有绑定银行卡
              this.content = "您还未绑定工资卡，请先绑定再领取";
              this.sendVal = true;
            } else {
              this.$router.push({path: "/wage", query: {"month": this.month}});
            }
          } else {
            this.$vux.toast.text(resultObj.msg, "middle");
          }
        }).catch(() => {
          this.$vux.toast.text("网络异常", "middle");
        });
      },
      queryMaterial() {//获取个人资料
        this.axios.get(baseUrl + "/userMaterial/select?sgin=" + this.userSign).then((res) => {
          let resultObj = res.data;
          if (resultObj.code == 0 && resultObj.data != null) {
            this.balance = toDecimal(resultObj.data.money);
          } else {
            this.$vux.toast.text(resultObj.msg, "middle");
          }
        });
      },
      querySalary() {//查询是否有待领取记录
        this.axios.get(baseUrl + "/billrecord/get_bill_record_list?sgin=" + this.userSign).then((res) => {
          let resultObj = res.data;
          if (resultObj.code == 0) {
            if (resultObj.data != null && resultObj.data.length > 0) {
              let arr = resultObj.data[0].split("年");
              this.month = arr[0] + "-" + (arr[1].replace("月", "") < 10 ? ('0' + arr[1].replace("月", "")) : arr[1].replace("月", ""));
            } else {
              this.month = "";
            }
          } else {
            this.$vux.toast.text(resultObj.msg, "middle");
          }
        });
      },
      cancel() {
        this.sendVal = false;
      },
      bindPage() {
        this.sendVal = false;
        sessionStorage.setItem("salary_sgin", "001122");
        this.$router.push("/bindcard");
      },
      toPage(path) {
        this.$router.push(path);
      },
      queryBank() {//查询提现信息
        this.axios.get(baseUrl + "/billrecord/query_bankcardwithDraw?sgin=" + this.userSign).then((res) => {
          let resultObj = res.data;
          if (resultObj.code == 0 && resultObj.data != null) {
            if (resultObj.data.type == 1) { //没有绑定银行卡
              this.content = "您还未绑定工资卡，请先绑定再提现";
              this.sendVal = true;
            } else {
              sessionStorage.setItem("with_bankname", resultObj.data.bankName);
              sessionStorage.setItem("with_banknumber", resultObj.data.bankNumber);
              sessionStorage.setItem("with_cardtype", resultObj.data.cardType);
              sessionStorage.setItem("reserved_phone", resultObj.data.phone);
              this.$router.push('/deposit');
            }
          } else {
            this.$vux.toast.text(resultObj.msg, "middle");
            return;
          }
        }).catch(() => {
          this.$vux.toast.text("网络异常", "middle");
        });
      }
    },
    components: {
      "v-dialog": dialog
    }
  }
</script>

<style lang="stylus" scoped>
  @import "../../../common/stylus/mixin.styl"
  .salary-wrap
    wh(100%, 100%)
    overflow: hidden
    .bg-box
      display: flex
      align-items: center
      margin: 0 auto
      margin-bottom: 0.267rem
      wh(100%, 3.6rem)
      bg-image("./bg.png", 100%, 100%)
      .money-box
        display: flex
        flex-direction: column
        margin-left: 0.48rem
        .title
          padding-bottom: 0.16rem
          size-color(0.4rem, rgba(255, 255, 255, 1))
          font-weight: 500
        .money
          padding-top: 0.16rem
          size-color(0.88rem, rgba(255, 255, 255, 1))
          font-weight: 500
      .deposit-box
        margin-left: auto
        margin-right: 0.32rem
        wh(1.76rem, 0.773rem)
        border: 0.027rem solid rgba(255, 255, 255, 1)
        border-radius(0.16rem)
        size-color(0.427rem, rgba(255, 255, 255, 1))
        background: rgba(34, 167, 255, 1)
    .item-box
      wh(100%, auto)
      size-color(0.427rem, rgba(51, 51, 51, 1))
      .content-box
        display: flex
        align-items: center
        wh(100%, 1.28rem)
        border-bottom: 0.027rem solid #f2f2f2
        .title
          margin-left: 0.373rem
        .pic
          margin-left: auto
          margin-right: 0.32rem
          wh(0.32rem, 0.32rem)
        .draw-box
          margin-left: auto
          margin-right: 0.32rem
          .back
            wh(0.32rem, 0.32rem)
          .draw
            margin-right: 0.16rem
            size-color(0.427rem, rgba(60, 175, 255, 1))
</style>
